<template>
  <div id="home">
    <top></top>
    <slide></slide>
    <div class="rvcontent">
      <router-view/>
    </div>
  </div>
</template>

<script>
import top from "./top.vue";
import slide from "./slide.vue";
export default {
  name: "home",
  components: {
    top,
    slide
  },
  data() {
    return {};
  }
};
</script>

<style lang="scss">
#home {
  .rvcontent {
    position: absolute;
    top: 70px;
    left: 240px;
    right: 0;
    bottom: 0;
    padding: 15px 20px;
    overflow-y: auto;
    background-repeat: no-repeat;
    padding: 20px;
    box-sizing: border-box;
    overflow-x: hidden;

    .titleTop {
      height: 50px;
      background: rgba(255, 255, 255, 1);
      box-shadow: 0px 0px 6px 0px rgba(189, 189, 190, 0.5);
      font-size: 18px;
      display: flex;
      justify-content: space-between;
      padding: 0 50px 0 12px;
      align-items: center;
      .iconfont {
        font-size: 20px;
      }
      .active {
        color: #1e7cf0;
      }
    }
    .messageSwdy {
      margin-top: 6px;
      height: 60px;
      background: rgba(226, 238, 253, 1);
      box-shadow: 0px 0px 2px 0px rgba(189, 189, 190, 0.5);
      border-radius: 6px;
      padding-left: 36px;
      font-size: 20px;
      font-weight:bold;
      color: #333333;
      line-height: 60px;
    }
  }
}
</style>
